<template>
	<div class="box">
		<h2>模态框</h2>
		<button @click="isVisible=true">显示模态框</button>
		<my-modal title="消息" :visible.sync="isVisible">
			<div slot="content">
				<p>这是一段html</p>
				<input/>
				<table class="table table-striped">
					<thead>
					<tr>
						<th>序号</th>
						<th>部门</th>
						<th>事项名称</th>
						<th>综合评分</th>
					</tr>
					</thead>
					<tbody>
					<tr v-for="item in 6" :key="item">
						<td>{{item}}</td>
						<td>{{item}}</td>
						<td>{{item}}</td>
						<td><span class="num">{{item}}</span></td>
					</tr>
					</tbody>
				</table>
			</div>
			<div slot="ft" class="ft">
				<a href="javscript:void(0)" class="btn btn-primary" @click="sure">确定</a>
				<a href="javscript:void(0)" class="btn btn-default" @click="isVisible=false">取消</a>
			</div>
		</my-modal>
	</div>
</template>

<script>
export default {
  name: "Index",
  data() {
    return {
      isVisible: false
    };
  },
  methods: {
    sure() {
      this.isVisible = false;
      this.$my_message("提交成功！", "success");
    }
  }
};
</script>
